Repository navigation
Fix code copy button covering code annotation marker - #15136
Merged
Merged
Conversation
Since the code-copy scaffold moved the copy button out of the pre, the rule that shifted it clear of the annotation gutter no longer matches, so the button sits on top of the marker and swallows its hover. The test checks that the marker is the element under its own center and that the annotation tooltip opens. It fails in chromium, firefox and webkit until the CSS is fixed. Refs #13444
Since the copy button moved out of the pre into the outer scaffold, the rule that shifted it left of the annotation gutter matched nothing, so the button sat on top of the marker of an annotated first line and swallowed its hover or click. The scaffold stays: it keeps the button from scrolling with the code while line numbers need visible overflow. The rule now targets the button through the scaffold that holds an annotated pre. Its margin can no longer be 1.25em: that relied on the button inheriting the code font size, and as a sibling of div.sourceCode its em is now the body size. The margin is the gutter width, calc(20px + 0.5em) in code font size, rewritten as 0.5 times $code-block-font-size so it holds when a theme changes that size, plus the default 5px. The button and the pre resolve em from the same parent, so the two stay in step. The test now also covers select mode, a theme with a 0.75em code block font size, and checks that the button of a block without annotations keeps its default position. Fixes #13444
The fix is not backported to v1.10, and on main the Regression fixes section marks entries that are.
The margin multiplied $code-block-font-size inside calc(), which only matches the gutter for length units. A percentage, which a theme or a brand typography size can set, resolved against the scaffold width in a margin, and pushed the button about 290px into the code. The button now takes the code block font size itself, so it shares the pre's em, and the margin repeats the gutter's own calc(20px + 0.5em) plus 5px. That holds for any value the pre accepts. The copy icon is sized in rem, so it keeps its size.
Collaborator
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
3 of 5 tasks
cderv
added this pull request to stack #15142
October 22, 2026 09:10
1 of 5 tasks
cderv
added a commit
that referenced
this pull request
Oct 22, 2026
Pull request runs check out the merge commit, so comparing absolute counts with the baseline blamed every open PR for an increase merged on main by another PR (#15136 after #15134). With --against HEAD^1 the PR is compared with the base branch tip and judged only on its own change; push runs keep the absolute baseline gate. gitChanges reads NUL-delimited git output through execProcess, splits renames into delete + add and checks every git call. --accept-increase replaces --accept-tests-increase and accepts any scope, since an uncovered increase in src needs a bump too. The new tests are characterisation tests of new functions: their first run failed at module load, which is not a RED step.
cderv
added a commit
that referenced
this pull request
Oct 22, 2026
Pull request runs now compare against the base branch, so a PR is judged on its own change. Comparing absolute counts blamed every open PR for an increase merged to main by another PR (#15136 after #15134). The check nets increases out per Deno API and per std module before any file is blamed, so a renamed file or a moved call is not a finding. An increase is an error only for a Deno API that src/deno_ral covers equivalently (build.os and build.arch, in scopes that can import it). Every other increase is a warning on the added line, and the job summary gives the per-scope delta and the baseline bump a maintainer accepts with --accept-increase. Std imports get only a suggested replacement, since a name check cannot show that a wrapper exports what the file uses. Pushes to main and manual runs keep the absolute baseline gate. - Delta mode reads the baseline committed at the base revision. A PR that adds nothing while main is above baseline gets only a notice. - Delta mode lists the whole base tree rather than passing every changed path to git, which keeps long comparisons under the Windows command-line limit. - Counts use a prototype-free dictionary, so an identifier such as constructor is an ordinary key. - src/core/lib is browser-shared and cannot import src/deno_ral, so an increase there is a warning, not an error. Related to #15134, #15135 and #15136.
cderv
added a commit
that referenced
this pull request
Oct 22, 2026
A code block that starts or ends a callout had its copy button above the code frame, with more space than a paragraph at the same edge. Since #13024 wrapped code blocks in a scaffold element, the callout edge rules applied to the scaffold instead of the code. At a callout edge the scaffold now takes its spacing as margin, so the button sits inside the code frame and the code gets the same gap as a paragraph. - Use margin instead of padding for code at a callout edge, including cells whose edge child is code - Exclude the copy button from the callout last-child spacing rule - Hit-test annotated code block markers in callouts (#13444), which needs #15136 merged first - Titled callouts now leave a gap between the header and the code frame, unlike the flush layout in 1.7 See #13238 for the broader padding-to-margin change, which this does not include, and #15137 for the same offset in column-grid sections. Fixes #13446
30 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Since #13024 wrapped the code copy button in
div.code-copy-outer-scaffold(first released in v1.8.15), the button no longer sits inside thepre.The rule that moved it clear of the annotation gutter,
.code-annotated .code-copy-button, still targets a descendant ofpre.code-annotated, so it matches nothing.On an annotated block the button lands on top of the marker on the first line, and the annotation can no longer be opened by hover or click.
Fix
The selector now follows the scaffold:
.code-copy-outer-scaffold:has(pre.code-annotated) > .code-copy-button.The scaffold itself stays, as it is what keeps the button from scrolling with the code and lets line numbers work (#13009, #5538).
The rule is based on the one suggested in the issue thread.
The old
1.25emmargin worked in 1.7 because the button sat inside thepreand inherited the code font size.The button now has the body font size, while the gutter is
calc(20px + 0.5em)in the code font size.The rule therefore sets
font-size: $code-block-font-sizeon the button, somargin-right: calc(20px + 0.5em + 5px)is the gutter width plus the button's usual 5px for any theme font size.It is written with
emrather than0.5 * $code-block-font-size, because a percentage value such as75%would resolve against the container width insidemarginand push the button far into the code.Annotated blocks inside callouts are still wrong, which is separate and tracked in #13446.
No backport is planned: the regression is from v1.8.15 and the stable release is v1.10.
Fixes #13444
Checklist
I have (if applicable):
AI-assisted PR
Note: autonomous AI agents submitting PRs without human oversight are not permitted — see the Code of Conduct.